<template>
  <div>
    <brand :items="[{ name: '数据统计', toName: 'atatistics' }]"></brand>
    <transition name="slide">
      <el-table
        v-loading="loading"
        :data="tableData"
        border
        style="width: 100%; margin-top: 15px"
      >
        <el-table-column prop="username" label="登入账户" width="120">
        </el-table-column>
        <el-table-column prop="lastLogin.ip" label="上次登录IP" width="180">
        </el-table-column>
        <el-table-column prop="lastLogin.loginTime" label="上次登录时间">
        </el-table-column>
        <el-table-column prop="nowLogin.ip" label="本次登录IP">
        </el-table-column>
        <el-table-column prop="nowLogin.loginTime" label="本次登录时间">
        </el-table-column>
      </el-table>
    </transition>
  </div>
</template>

<script>
import brand from "components/Brand";
import { getLog } from "api/interface";
export default {
  components: {
    brand,
  },
  data() {
    return {
      tableData: [],
      loading: true,
    };
  },
  created() {
    getLog()
      .then(({ data }) => {
        this.tableData = data.data;
        this.loading = false;
      })
      .catch(() => {});
  },
};
</script>

<style scoped>
.slide-enter-active,
.slide-leave-active {
  transition: 0.4s;
}
.slide-enter,
.slide-leave-to {
  opacity: 0;
}
</style>
